<template>
  <div>
    <h3>勉勉强强中</h3>
    <MyProduct
      v-for="item in list"
      :key="item.id"
      :proname="item.proname"
      :proprice="item.proprice"
      :desc="item.desc"
      :id="item.id"
      @less="less"
    ></MyProduct>
  </div>
</template>

<script>
import MyProduct from "./component/MyProduct.vue";
export default {
  components: {
    MyProduct,
  },
  methods:{
    less(id,num){
      this.list.forEach(item=>{
        if(item.id===id)
        item.proprice>item.low
        ?(item.proprice-=num)
        :(alert('努力不动了'))
      })
    }
  },
  data() {
    return {
      list: [
        {
          id: 1,
          proname: "超级好吃棒棒糖",
          proprice: 188,
          low: 160,
          desc: "甜",
        },
        {
          id: 2,
          proname: "超级好吃的大鸡腿",
          proprice: 360,
          low: 320,
          desc: "香",
        },
        { id: 3, proname: "超级无敌冰激凌", proprice: 42, low: 30, desc: "冰" },
      ],
    };
  },
};
</script>

<style>
</style>